    /* 主界面标签 */
    * {
        margin: 0;
        padding: 0;
        box-sizing: border-box;
        font-family: arial;
    }


    body {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    min-height: 210vh;
    margin: 0;
    padding: 0;
    background-image: url('../picture/treebj.jpg'); /* 替换为你的图片路径 */
    background-color: rgb(9, 5, 8); /* 背景颜色作为回退选项 */
    background-size: cover; /* 使背景图片覆盖整个元素 */
    background-position: center; /* 将背景图片放置在元素中心 */
    background-repeat: no-repeat; /* 防止背景图片重复 */
    background-attachment: fixed; /* 滚动时背景图片固定 */
}


    .navbar {
        list-style-type: none;
        margin: 0;
        padding: 0;
        overflow: hidden;
        background-color: rgb(231, 130, 206);
        position: fixed; /* 固定导航栏在顶部 */
        width: 100%;
        top: 0;
        z-index: 100; /* 确保导航栏在页面内容上方 */
    }

    .navbar li {
        float: left;
    }

    .navbar li a {
        display: block;
        color: white;
        text-align: center;
        padding: 14px 16px;
        text-decoration: none;
    }


    h1 {
        position: relative; /* 绝对定位 */
        top: 390px;
        letter-spacing: 15px;
        text-transform: uppercase;
        text-align: center;
        color: #0e3742;
        line-height: 0.7em;
        outline: none;
        font-size: 60px;
        animation: animate 8s linear infinite;
    }

    @keyframes animate {
        0%,21%,31%,51%,60%,80%,90%,92% {
            color: #0e3742;
        }
        20%,30%,50%,60%,80%,90%,100% {
            color: #fff;
            text-shadow: 0 0 1px #03bcf4,
                         0 0 2px #03bcf4,
                         0 0 4px #03bcf4,
                         0 0 8px #03bcf4;
        }
    }